$(function() {
	// 添加鼠标悬停事件
	var as = document.querySelector('.top').querySelectorAll('a');

	for (var i = 0; i < as.length; i++) {
		as[i].onmouseover = function() {
			this.style.color = "#fff";
		}
		as[i].onmouseout = function() {
			this.style.color = "";
		}
	}
	
	var as1 = document.querySelector('.header-li').querySelector('ul').querySelectorAll('a');
	// console.log(as1);
	for (var i = 0; i < as1.length; i++) {
		as1[i].onmouseover = function() {
			this.style.color = "#ff6700";
		}
		as1[i].onmouseout = function() {
			this.style.color = "";
		}
	}
	
	var as2 = document.querySelector('.search-txt').querySelectorAll('a');

	for (var i = 0; i < as2.length; i++) {
		as2[i].onmouseover = function() {
			this.style.backgroundColor = "#ff6700";
			this.style.color = "#fff";


		}
		as2[i].onmouseout = function() {
			this.style.backgroundColor = "";
			this.style.color = "";
		}
	}

	// 搜索框下拉
	$(".header-search .srarch-ar").click(function() {
		$(this).next().next().next().fadeIn();
		$(this).next().next().hide();
		$(this).css("border-color", "red");
		$(this).next().css("border-color", "red");
	});
	$(".header-search .srarch-ar").blur(function() {
		$(this).next().next().next().hide();
		$(this).next().next().show();
		$(this).css("border-color", "#e0e0e0");
		$(this).next().css("border-color", "#e0e0e0");
	});
	$(".header-search .srarch-ar").dblclick(function() {
		$(this).val("");
	});

	var as3 = document.querySelector('.result-list').querySelectorAll('a');
	var list = document.querySelector('.result-list').querySelectorAll('li');
	for (var i = 0; i < as3.length; i++) {
		as3[i].onmouseover = function() {
			this.style.color = "#ff6700";
		}
		list[i].addEventListener('mousemove', function() {
			this.style.backgroundColor = "rgb(224, 224, 224)";
			document.querySelector('#srarch-ar').value = this.innerText;
			console.log(this.innerText);
		});
		as3[i].onmouseout = function() {
			this.style.color = "";
		}
		list[i].addEventListener('mouseout', function() {
			this.style.backgroundColor = "";
			document.querySelector('#srarch-ar').value = "";
		});
	}

	// 按s键焦点定位事件:
	var site_seach = document.querySelector('#srarch-ar');

	document.addEventListener('keyup', function(event) {
		if (event.keyCode == 83) {
			site_seach.focus();
		}
	});

	// 导航栏:ff6700

	$('#menu-content a').mouseover(function() {
		$(this).css('background-color', "#ffaaff");

	});
	$('#menu-content a').mouseout(function() {
		$(this).css('background-color', "");
	});

	// 菜单
	var menu = document.getElementById("menu-content");
	var menuItems = menu.querySelector("ul").querySelectorAll('a');
	console.log(menuItems);
	var subMenu = document.getElementById("sub-menu");
	var subMenuItems = subMenu.getElementsByClassName("inner-box");

	function setMenu() {
		for (var i = 0; i < menuItems.length; i++) {
			menuItems[i].setAttribute("data-index", i);
			menuItems[i].onmouseover = function() {
				subMenu.style.display = 'block';
				for (var j = 0; j < subMenuItems.length; j++) {
					subMenuItems[j].style.display = 'none';
					menuItems[j].style.background = 'none';
				}
				var idx = this.getAttribute("data-index");
				subMenuItems[idx].style.display = 'block';
			};

			menu.onmouseout = function() {
				subMenu.style.display = 'none';
			};
			subMenu.onmouseover = function() {
				this.style.display = 'block';
			};
			subMenu.onmouseout = function() {
				this.style.display = 'none';
			};
		}
	}
	setMenu();

	// 小圆点特效
	var index = 0;
	var dots = document.getElementById("dots").getElementsByTagName("span");
	var pics = document.getElementById("banner").getElementsByTagName("div");
	var len = pics.length;

	function changeImg() {
		//遍历banner下所有div及dots下所有span，将div隐藏，将span清除类
		for (var i = 0; i < len; i++) {
			pics[i].style.display = 'none';
			dots[i].className = "";
		}
		//根据index索引找到当前div，将其显示出来
		pics[index].style.display = 'block';
		dots[index].className = "active";
	}

	function slideImg() {
		var main = document.getElementById("main");
		main.onmouseover = function() {
			if (timer) {
				clearInterval(timer);
			}
		};
		main.onmouseout = function() {
			//每隔2秒执行一次换图 setInterval()方法
			timer = setInterval(function() {
				index++;
				if (index > len - 1) {
					index = 0;
				}
				//切换图片
				changeImg();
			}, 4000);
		};
		//进入网页自动触发轮播
		main.onmouseout();
		setCirclePointEvent();
		// setNextAndPrevButtonEvent();
	}

	function changeImg() {
		for (var i = 0; i < len; i++) {
			pics[i].style.display = 'none';
			dots[i].className = "";
		}
		$(pics[index]).fadeIn(600);
		dots[index].className ="active";
	}

	//小圆点绑定点击切换图片事件
	function setCirclePointEvent() {
		for (var i = 0; i < len; i++) {
			//给所有span设置id，值为i，作为span的索引
			dots[i].id = i;
			dots[i].onclick = function(ev) {

				index = this.id;
				//切换图片
				changeImg();
			};
		}
	}
	changeImg();
	slideImg();

	// 向导的鼠标悬停变色效果
	var as4 = document.querySelector('.channel-list').querySelectorAll('a');

	for (var i = 0; i < as4.length; i++) {
		as4[i].onmouseover = function() {
			this.style.color = "#fff";
		}
		as4[i].onmouseout = function() {
			this.style.color = "";
		}
	}
	// 向导的图片切换效果
	var flag = true;
	var timer2;

	function cj() {
		if (flag) {
			$(".xm-carousel-list").css("margin-left", "0px");
			flag = false;
		} else {
			$(".xm-carousel-list").css("margin-left", "-992px");
			flag = true;
		}
	}

	function play2() {
		timer2 = setInterval(function() {
			cj();
		}, 3000);
	}

	function stopTimer2() {
		clearInterval(timer2);
	}
	play2();
	$(".xm-carousel-list").mouseover(function() {
		stopTimer2();
	});
	$(".xm-carousel-list").mouseout(function() {
		play2();
	});
	$(".span2").mouseover(function() {
		$(this).css("color", "#ff6700");
		$(this).css('background-color', "pink");
	});
	$(".span2").mouseout(function() {
		$(this).css("color", "#b0b0b0");
		$(this).css('background-color', "#fff");
	});
	$(".rightBtn").click(function() {
		$(".xm-carousel-list").css("margin-left", "-992px");
	});
	$(".leftBtn").click(function() {
		$(".xm-carousel-list").css("margin-left", "0px");
	});



	function seckill(str1, str2) {
		var startTime = +new Date(str1);
		//设置秒杀专场当天的00:00时基于1970年的毫秒数
		var zeroOclock = +new Date(str2);
		//将上述两个时间相减，将结果换算成24小时制的时间放在specialTime里显示用于表明多少点的场次
		var h1 = (startTime - zeroOclock) / 1000 / 60 / 60;
		//若时间为个数，前面补个0
		h1 = h1 < 10 ? "0" + h1 : h1;
		//获取显示场次信息的那个div元素的对象
		var box = document.getElementById("specialTime");
		//在里面添加两个p标签，分别存放时间和描述性中文
		box.innerHTML = "<p id=\"strong\">" + h1 + ":00</p>" + "<p id=\"nomal\">点场 倒计时</p>";
		//获取时分秒盒子的对象
		var span = document.querySelector('#leftTime').getElementsByTagName("span");
		//获取当前时间基于1970年的毫秒数
		var now = +new Date;
		// console.log(now);
		// console.log(startTime);
		// 如果开场时间未到，则不停地计时
		if ((startTime - now) > 0) {
			cal();
			var countDown = setInterval(cal, 1000);
		}

		function cal() {
			// 重新获取当前时间
			now = +new Date();
			// 计算开场时间与现在时间的差
			var leftTime = startTime - now;
			// 分别计算年月日
			var h = parseInt(leftTime / 1000 / 60 / 60 % 24);
			h = h < 10 ? "0" + h : h;
			var m = parseInt(leftTime / 1000 / 60 % 60);
			m = m < 10 ? "0" + m : m;
			var s = parseInt(leftTime / 1000 % 60);
			s = s < 10 ? "0" + s : s;

			// 如果时间到了，则停止计时，时间没到的话，就更新倒计时
			if ((h + m + s) != "00000000") {
				span[0].innerHTML = h;
				span[1].innerHTML = m;
				span[2].innerHTML = s;
			} else {
				span[2].innerHTML = s;
				clearInterval(countDown);
			}
		}
	}
	// console.log(document.querySelector('.more'))
	seckill("2020-07-10 17:00:00", "2020-07-10 00:00:00");

	var oDiv = document.getElementById('dome');
	var oUl = oDiv.getElementsByTagName('ul')[0];
	console.log(oUl);
	var Li = oUl.getElementsByTagName('li'); //获取ul下的所有li
	oUl.innerHTML += oUl.innerHTML //li下的内容进行想加
	oUl.style.width = (Li[0].offsetWidth + 14) * Li.length + 'px'; //ul的宽度等于每个li的宽度乘以所有li的长度
	console.log(oUl.style.width)
	var speed = 2
	//主方法
	function move() {
		//如果左边横向滚动了长度一半之后,回到初始位置
		// console.log(oUl.offsetLeft)
		if (oUl.offsetLeft < -oUl.offsetWidth / speed) {
			oUl.style.left = '0'
		}
		oUl.style.left = oUl.offsetLeft - 1 + 'px'; //进行左横向滚动
	}
	//调用方法
	var timer = setInterval(move, 30)
	//鼠标指向的时候 暂停
	oDiv.onmouseover = function() {
		clearInterval(timer);
	}
	//鼠标离开之后 继续滚动
	oDiv.onmouseout = function() {
		timer = setInterval(move, 30)
	}
	
	var as5 = document.querySelector('#dome').querySelectorAll('p');
	
	for (var i = 0; i < as5.length; i++) {
		as5[i].onmouseover = function() {
			this.style.color = "skyblue";
		}
		as5[i].onmouseout = function() {
			this.style.color = "";
		}
	}
	$(".header-li ul .menu-buttom").mouseover(function() {
		$("#menu_content_bg").css("border", "1px solid #D0D0D0");
		$(this).css("color", "#ff6700");
		$("#" + $(this).attr("switch")).show()
		idx=$("#" + $(this).attr("switch"));
		//console.log(idx)
		$("#menu_content_bg").height(228);
	});
	$(".header-li ul .menu-buttom").mouseout(function() {
		$("#" + $(this).attr("switch")).hide();
		$(this).css("color", " #424242");
		$("#menu_content_bg").height(0);
		$("#menu_content_bg").css("border", "1px solid #fff");
	});
	$("#yingcang").mouseover(function(){
		$("#menu_content_bg").css("border", "1px solid #D0D0D0");
		idx.show().stop();
		//console.log(idx);
		$("#menu_content_bg").height(228);
	});
	$("#yingcang").mouseout(function(){
		idx.hide().stop();
		$("#menu_content_bg").height(0);
		$("#menu_content_bg").css("border", "1px solid #fff");
		
	})
	
	
	$(".body-bd .row-right ul li").hover(function() {
		$(this).css({
			"top": "-5px",
			"box-shadow": "0px 15px 30px rgba(0,0,0,0.2)"
		});
	}, function() {
		$(this).css({
			"top": "0px",
			"box-shadow": "none"
		});
	})
	
	
	var myvideo=videojs("myvideo0");
	 myvideo.width(398);
	 myvideo.height(320);
	 		 
	 var myvideo1=videojs("myvideo1");
	  myvideo1.width(398);
	  myvideo1.height(320);
	  		
	  var myvideo2=videojs("myvideo2");
	   myvideo2.width(398);
	   myvideo2.height(320);
		 
});
